<template>
  <div class="operation">
    <Tabs v-model="tabKey" class="tabs-app" @on-click="handleTab">
      <TabPane label="数字化覆盖度现状" name="coverStatus" class="tab-pane">
        <coverStatus v-if="tabKey == 'coverStatus'" @changeTab="changeTab" :tabKey="'coverStatus'"></coverStatus>
      </TabPane>
      <TabPane label="数字化覆盖目标" name="coverGoal" class="tab-pane">
        <coverStatus v-if="tabKey == 'coverGoal'" :tabKey="'coverGoal'"></coverStatus>
      </TabPane>
    </Tabs>
  </div>
</template>

<script>
import coverStatus from './status/coverStatus.vue'
export default {
  name: 'coverageStatisticsPage2',
  components: {
    coverStatus
  },
  data() {
    return {
      tabKey: 'coverStatus',
      statusTableData: [],
      goalTableData: [],
      // loadedTabs: {}, // 用来跟踪哪些tab的数据已经被加载过  
    }
  },
  methods: {
    weightConfig() { },
    orgAdm() { },
    keyConfig() { },
    changeTab(val) {
      this.tabKey = val
    },
    handleTab(name) {
      // if (name === 'coverGoal') {
      //   const params = {
      //     currentPage: 0,
      //     pageSize: 10
      //   }
      //   if (!this.goalTableData.length) {
      //     coverApi.getGoalData(params).then(res => {
      //       this.goalTableData = res.data.records
      //     })
      //   }
        
      // } else {
      //   this.statusTableData = []
      // }
      // this.loadedTabs[name] = true; // 标记该tab的数据已加载
    }
  },
  created() {}
}
</script>

<style lang="less" scoped>
.operation {
  position: relative;
  .btn_group {
    position: absolute;
    top: 10px;
    right: 30px;
    button {
      margin-left: 20px;
    }
  }
}
</style>